﻿<UserControl x:Class="FacebookClient.EmbeddedBrowserControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    mc:Ignorable="d"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    d:DesignHeight="400" d:DesignWidth="800">
  <UserControl.Resources>

    <Style x:Key="CaptionButtonStyle" TargetType="{x:Type ButtonBase}">
      <Setter Property="OverridesDefaultStyle" Value="true" />
      <Setter Property="FocusVisualStyle" Value="{x:Null}" />
      <Setter Property="Focusable" Value="False" />
      <Setter Property="Cursor" Value="Hand" />
      <Setter Property="Margin" Value="2"/>
      <Setter Property="VerticalContentAlignment" Value="Center" />
      <Setter Property="HorizontalContentAlignment" Value="Center" />
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="{x:Type ButtonBase}">
            <Border x:Name="Border" Background="Transparent">
              <ContentPresenter x:Name="cp" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Opacity="0.5" RecognizesAccessKey="True" />
            </Border>
            <ControlTemplate.Triggers>
              <Trigger Property="IsPressed" Value="True">
                <Setter TargetName="cp" Property="RenderTransform">
                  <Setter.Value>
                    <TranslateTransform Y="1" />
                  </Setter.Value>
                </Setter>
              </Trigger>
              <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                  <BeginStoryboard>
                    <Storyboard>
                      <DoubleAnimation Duration="00:00:00.1" Storyboard.TargetName="cp" Storyboard.TargetProperty="Opacity" To="1.0" />
                    </Storyboard>
                  </BeginStoryboard>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                  <BeginStoryboard>
                    <Storyboard>
                      <DoubleAnimation Duration="00:00:00.2" Storyboard.TargetName="cp" Storyboard.TargetProperty="Opacity" />
                    </Storyboard>
                  </BeginStoryboard>
                </Trigger.ExitActions>
              </Trigger>
              <Trigger Property="IsEnabled" Value="False">
                <Trigger.EnterActions>
                  <BeginStoryboard>
                    <Storyboard>
                      <DoubleAnimation Duration="00:00:00.1" Storyboard.TargetName="cp" Storyboard.TargetProperty="Opacity" To="0.1" />
                    </Storyboard>
                  </BeginStoryboard>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                  <BeginStoryboard>
                    <Storyboard>
                      <DoubleAnimation Duration="00:00:00.2" Storyboard.TargetName="cp" Storyboard.TargetProperty="Opacity" />
                    </Storyboard>
                  </BeginStoryboard>
                </Trigger.ExitActions>
              </Trigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>
  </UserControl.Resources>
  
  <DockPanel>
    <Border DockPanel.Dock="Top" 
        Background="{DynamicResource ContentChromeBackground}"
        BorderBrush="{DynamicResource ContentChromeBorderBrush}" 
        BorderThickness="1,1,1,0"
        CornerRadius="6,6,0,0">
      <Grid >
        <Grid.RowDefinitions>
          <RowDefinition Height="Auto" />
          <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="42" />
          <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Border Grid.ColumnSpan="2" Grid.RowSpan="2" Height="6" VerticalAlignment="Bottom" Background="{DynamicResource ApplicationBarShadowBrush}"/>

        <Button x:Name="BackButton" Grid.RowSpan="2" Style="{DynamicResource BackButtonStyle}" Click="_OnBrowseBackClicked" />

        <StackPanel Grid.RowSpan="2" Height="32" HorizontalAlignment="Right" Orientation="Horizontal">
          <Rectangle Width="1" Fill="#7000" />
          <Rectangle Width="1" Fill="#3FFF" />
        </StackPanel>

        <DockPanel Grid.Column="1">
          <StackPanel DockPanel.Dock="Right" HorizontalAlignment="Right" Margin="4,2" VerticalAlignment="Top" Orientation="Horizontal">
            <Button Width="24" Height="24" Style="{StaticResource CaptionButtonStyle}" Click="_OnRefresh" ToolTip="Refresh">
              <Path Width="12" Height="12" Data="{DynamicResource RefreshGeometry}" Fill="White" Stretch="Fill" />
            </Button>
            <Button Width="24" Height="24" Style="{StaticResource CaptionButtonStyle}" Click="_OnBreakout" RenderTransformOrigin=".5,.5" ToolTip="Pop-out">
              <Path Width="12" Height="12" Data="M64.54,0L98.15,33.60 57.44,74.31 80,96.86 0,96.86 0,16.86 23.84,40.70z" Fill="White" Stretch="Fill" />
              <Button.RenderTransform>
                <RotateTransform Angle="180"/>
              </Button.RenderTransform>
            </Button>
            <Button Width="24" Height="24" Style="{StaticResource CaptionButtonStyle}" Click="_OnClose" ToolTip="Return to Fishbowl">
              <Path Width="11" Height="11" Data="{DynamicResource CloseXGeometry}" Stretch="Fill" Stroke="White" StrokeThickness="2.5" />
            </Button>
          </StackPanel>

          <TextBlock x:Name="TitleTextBlock" Margin="10, 3" VerticalAlignment="Center" Foreground="White" TextTrimming="CharacterEllipsis" FontSize="{DynamicResource MiddleFontSize}" FontWeight="Bold" FontFamily="{DynamicResource SansSerifFont}" />
        </DockPanel>
        
        <DockPanel Grid.Row="1" Grid.Column="1">
          <TextBlock x:Name="UriTextBlock" Margin="20, 3, 3, 4" VerticalAlignment="Center" Foreground="White" TextTrimming="CharacterEllipsis" FontSize="{DynamicResource SmallFontSize1}" FontWeight="Light" FontFamily="{DynamicResource SansSerifFont}" />
        </DockPanel>
      </Grid>
    </Border>
    <Border x:Name="BrowserHost"
            BorderBrush="{DynamicResource ContentChromeBorderBrush}" 
            BorderThickness="1,0,1,1" />
  </DockPanel>
</UserControl>
